import React from "react";
import {CoverPicture, Follower, RecItem, RecommendAuthorInfo} from './style';
import PropTypes from "prop-types";


const RecommendItem = (props) => {
    const {imageUrl, name, gameCount} = props;
    return (
        <RecItem>
            {/*头像区 —— 左右两侧的相对定位*/}
            <CoverPicture
                alt='加载失败'
                src={imageUrl}>
            </CoverPicture>
            {/*按钮区 —— 左右两侧的相对定位*/}
            <Follower>
                进入专区
            </Follower>
            {/*标题区*/}
            <RecommendAuthorInfo>
                <p className='company-name'>{name}</p>
                <p className='company-description'>共收录{gameCount}款游戏</p>
            </RecommendAuthorInfo>
        </RecItem>
    )

}

RecommendItem.propTypes = {
    imageUrl: PropTypes.string,
    name: PropTypes.string,
    gameCount: PropTypes.number,
}
export default RecommendItem;
